<template>
    <div style="height: 100%">
        <div style="text-align: center; width: 200px; line-height: 60px; font-size: 20px">模块信息</div>
        <div class="list-left" :style="{ height: leftHgt }">
            <div class="module" style="height: 100%">
                <div class="left-tree">
                    <el-tree
                        ref="tree1"
                        class="filter-tree"
                        node-key="id"
                        :data="showTreeData"
                        @node-click="handleNodeClick"
                        :current-node-key="currentNodeKey"
                        highlight-current
                        default-expand-all
                        :expand-on-click-node="false"
                    >
                    </el-tree>
                </div>
            </div>
        </div>

        <div style="height: 100%">
            <div class="list-right">
                <div class="list-right-div">
                    <el-button type="primary" key="table1-btn5" @click="handleRefresh()">刷新</el-button>
                    <el-button type="primary" key="table1-btn1" v-if="currentNodeKey === '2'" @click="addTabs('addStatic', '')">新增</el-button>
                    <el-button type="primary" key="table1-btn1" v-if="currentNodeKey === '1'" @click="addTabs('add', '')">新增</el-button>
                    <el-button type="primary" key="table1-btn1" v-if="currentNodeKey === '3'" @click="addTabs('addBW', '')">新增</el-button>
                    <el-button type="primary" key="table1-btn1" v-if="currentNodeKey === '4'" @click="addTabs('addEngine', '')">新增</el-button>
                    <el-button type="primary" key="table1-btn1" v-if="currentNodeKey === '5'" @click="addTabs('addOIS', '')">新增</el-button>
                    <el-button type="primary" key="table1-btn1" v-if="currentNodeKey === '6'" @click="addTabs('addStaticRiskDisposal', '')"
                        >新增</el-button
                    >
                    <el-button type="primary" key="table1-btn1" v-if="currentNodeKey === '15'" @click="addTabs('addReminderRules', '')"
                        >新增</el-button
                    >
                    <el-button type="danger" size="mini" key="table1-btn2" @click="handleDelete(tableSelection)">删除</el-button>
                    <el-button type="primary" key="table1-btn3" @click="validSymbolBtn(tableSelection, '0')">启用</el-button>
                    <el-button type="danger" size="mini" key="table1-btn4" @click="validSymbolBtn(tableSelection, '1')">禁用</el-button>
                    <el-button type="primary" size="mini" key="table1-btn6" @click="sendEmail" v-if="currentNodeKey === '6'">生成发送待办</el-button>
                </div>

                <div style="height: calc(100vh - 170px)" v-if="!isExit3">
                    <vxe-table
                        :data="dataSource"
                        :key="tableKey"
                        v-table-top="paging.currentPage"
                        @checkbox-change="handleSelectionChange"
                        @checkbox-all="handleSelectionChange"
                        border
                        ref="xTable"
                        size="mini"
                        style="width: 100%"
                        height="100%"
                        :auto-resize="true"
                        :resizable-config="{ minWidth: '90' }"
                        :filter-config="{ remote: true }"
                        :sort-config="{ remote: true }"
                        @sort-change="handleSelectionChange2"
                        @filter-change="handleFilterChange"
                        @resizable-change="handleResizeChange"
                        show-header-overflow
                        :row-style="{ height: '35px' }"
                        :cell-style="{ padding: '0px' }"
                    >
                        <vxe-column type="checkbox" width="55" size="mini" align="center" :selectable="getSelectableModule" resizable> </vxe-column>
                        <vxe-column field="ruleId" title="规则编码" min-width="120" sortable :filters="[{ data: '' }]" show-overflow resizable>
                            <template #filter="{ $panel, column }">
                                <el-input
                                    class="my-input"
                                    type="type"
                                    v-for="(option, index) in column.filters"
                                    :key="index"
                                    v-model="option.data"
                                    @input="$panel.changeOption($event, !!option.data, option)"
                                />
                            </template>
                        </vxe-column>
                        <vxe-column field="ruleName" title="规则名称" min-width="120" sortable :filters="[{ data: '' }]" show-overflow resizable>
                            <template #filter="{ $panel, column }">
                                <el-input
                                    class="my-input"
                                    type="type"
                                    v-for="(option, index) in column.filters"
                                    :key="index"
                                    v-model="option.data"
                                    @input="$panel.changeOption($event, !!option.data, option)"
                                />
                            </template>
                        </vxe-column>
                        <vxe-column
                            field="noticeType"
                            title="通知类型"
                            min-width="120"
                            sortable
                            show-overflow
                            :filters="calcFilterNoticeType"
                            resizable
                        >
                            <template slot-scope="scope">
                                <span> {{ noticeTypeStorage[scope.row.noticeType] }}</span>
                            </template>
                        </vxe-column>
                        <vxe-column
                            field="status"
                            title="启用状态"
                            sortable
                            min-width="120"
                            show-overflow
                            align="center"
                            :filters="[
                                { label: '启用', value: '0' },
                                { label: '禁用', value: '1' },
                            ]"
                            resizable
                        >
                            <template slot-scope="scope">
                                <span :style="getStyle('status', scope.row['status'])">
                                    {{ stateEnum[scope.row['status']] || '--' }}
                                </span>
                            </template>
                        </vxe-column>
                        <vxe-column field="modifyUser" title="更新人" min-width="120" sortable :filters="[{ data: '' }]" show-overflow resizable>
                            <template #filter="{ $panel, column }">
                                <el-input
                                    class="my-input"
                                    type="type"
                                    v-for="(option, index) in column.filters"
                                    :key="index"
                                    v-model="option.data"
                                    @input="$panel.changeOption($event, !!option.data, option)"
                                />
                            </template>
                        </vxe-column>
                        <vxe-column field="modifyTime" title="更新时间" min-width="160" sortable show-overflow align="center" resizable>
                            <template #filter="{ $panel, column }">
                                <el-input
                                    class="my-input"
                                    type="type"
                                    v-for="(option, index) in column.filters"
                                    :key="index"
                                    v-model="option.data"
                                    @input="$panel.changeOption($event, !!option.data, option)"
                                />
                            </template>
                            <template slot-scope="scope">
                                <span> {{ dateFormatter(scope.row.modifyDate, scope.row.modifyTime) }}</span>
                            </template>
                        </vxe-column>
                        <vxe-column field="createUser" title="创建人" min-width="120" sortable :filters="[{ data: '' }]" show-overflow resizable>
                            <template #filter="{ $panel, column }">
                                <el-input
                                    class="my-input"
                                    type="type"
                                    v-for="(option, index) in column.filters"
                                    :key="index"
                                    v-model="option.data"
                                    @input="$panel.changeOption($event, !!option.data, option)"
                                />
                            </template>
                        </vxe-column>
                        <vxe-column field="createTime" title="创建时间" min-width="160" sortable show-overflow align="center" resizable>
                            <template slot-scope="scope">
                                <span> {{ dateFormatter(scope.row.createDate, scope.row.createTime) }}</span>
                            </template>
                        </vxe-column>

                        <vxe-column title="操作" min-width="230" fixed="right">
                            <template slot-scope="scope">
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-view"
                                    topTitle="查看"
                                    @on-click="addTabs('look', scope.row)"
                                    v-if="(currentNodeKey === '1' || currentNodeKey === '0') && ['0'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-edit"
                                    topTitle="编辑"
                                    @on-click="addTabs('edit', scope.row)"
                                    v-if="(currentNodeKey === '1' || currentNodeKey === '0') && ['0'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-view"
                                    topTitle="查看"
                                    @on-click="addTabs('lookStatic', scope.row)"
                                    v-if="(currentNodeKey === '2' || currentNodeKey === '0') && ['6', '12'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-edit"
                                    topTitle="编辑"
                                    @on-click="addTabs('editStatic', scope.row)"
                                    v-if="(currentNodeKey === '2' || currentNodeKey === '0') && ['6', '12'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-view"
                                    topTitle="查看"
                                    @on-click="addTabs('lookBW', scope.row)"
                                    v-if="(currentNodeKey === '3' || currentNodeKey === '0') && ['9', '10'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-edit"
                                    topTitle="编辑"
                                    @on-click="addTabs('editBW', scope.row)"
                                    v-if="(currentNodeKey === '3' || currentNodeKey === '0') && ['9', '10'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-view"
                                    topTitle="查看"
                                    @on-click="addTabs('lookEngine', scope.row)"
                                    v-if="currentNodeKey === '4' && ['3', '4'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-edit"
                                    topTitle="编辑"
                                    @on-click="addTabs('editEngine', scope.row)"
                                    v-if="currentNodeKey === '4' && ['3', '4'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-view"
                                    topTitle="查看"
                                    @on-click="addTabs('lookOIS', scope.row)"
                                    v-if="currentNodeKey === '5' && ['13'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-edit"
                                    topTitle="编辑"
                                    @on-click="addTabs('editOIS', scope.row)"
                                    v-if="currentNodeKey === '5' && ['13'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-view"
                                    topTitle="查看"
                                    @on-click="addTabs('lookReminderRules', scope.row)"
                                    v-if="(currentNodeKey === '15' || currentNodeKey === '0') && ['15'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-edit"
                                    topTitle="编辑"
                                    @on-click="addTabs('editReminderRules', scope.row)"
                                    v-if="(currentNodeKey === '15' || currentNodeKey === '0') && ['15'].includes(scope.row.noticeType)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="danger"
                                    icon="el-icon-delete"
                                    topTitle="删除"
                                    @on-click="handleDelete(scope.row.ruleId)"
                                ></RiskIconButton>
                                <RiskIconButton
                                    type="primary"
                                    icon="el-icon-time"
                                    topTitle="邮件发送记录"
                                    @on-click="handleEmailHistory('history', scope.row)"
                                ></RiskIconButton>
                            </template>
                        </vxe-column>
                    </vxe-table>
                </div>
                <div style="height: calc(100vh - 170px)" v-else>
                    <RiskTableP ref="risk-table" :tableConfig="tableConfig" :tableData="dataSource" :column="showColumns" :key="tableKey">
                        <template #operation="scope">
                            <RiskIconButton
                                type="primary"
                                icon="el-icon-view"
                                topTitle="查看"
                                @on-click="addTabs('lookStaticRiskDisposal', scope.row)"
                            ></RiskIconButton>
                            <RiskIconButton
                                type="primary"
                                icon="el-icon-edit"
                                topTitle="编辑"
                                @on-click="addTabs('editStaticRiskDisposal', scope.row)"
                            ></RiskIconButton>
                            <RiskIconButton
                                type="danger"
                                icon="el-icon-delete"
                                topTitle="删除"
                                @on-click="handleDelete(scope.row.ruleId)"
                            ></RiskIconButton>
                            <!-- <RiskIconButton
                                type="primary"
                                icon="el-icon-time"
                                topTitle="邮件发送记录"
                                @on-click="handleEmailHistory('history-disposal', scope.row)"
                            ></RiskIconButton> -->
                        </template>
                    </RiskTableP>
                </div>
                <div class="block">
                    <el-pagination
                        background
                        @current-change="currentChange"
                        layout="total, prev, pager, next"
                        :total="dataSource.length"
                        :page-size="paging.pageSize"
                        :current-page.sync="paging.currentPage"
                    >
                    </el-pagination>
                </div>
            </div>
        </div>

        <!-- 删除 -->
        <el-dialog
            drag
            title="确定删除以下规则吗?"
            :visible.sync="deleteVisible"
            width="500px"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
        >
            <div class="remove-text">
                <span> {{ delCodeList.join(' , ') }}</span>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button size="mini" @click="deleteVisible = false">取 消</el-button>
                <el-button size="mini" type="primary" @click="submitDeleteNotice">确 定</el-button>
            </div>
        </el-dialog>

        <!-- 禁用/启用 -->
        <el-dialog drag :visible.sync="validSymbolVisible" width="500px" :close-on-click-modal="false" :close-on-press-escape="false">
            <div slot="title" class="dialog-title">
                <h3>
                    {{ stateType === '0' ? '确定启用以下规则吗?' : '确定禁用以下规则吗?' }}
                    <span style="color: hsl(0deg 65% 51%); font-size: 13px; margin-left: 15px"
                        >(备注: 已自动过滤{{ stateType == '0' ? '已启用' : '已禁用' }}的规则)</span
                    >
                </h3>
            </div>
            <div class="remove-text">
                <span> {{ validCodeList.join(' , ') }}</span>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button size="mini" @click="validSymbolVisible = false">取 消</el-button>
                <el-button size="mini" type="primary" @click="submitValidSymbol">确 定</el-button>
            </div>
        </el-dialog>

        <!-- 单个规则发送记录  -->
        <yh-dialog
            drag
            :title="sendRecordTitle"
            :visible.sync="sendRecordVisible"
            width="900px"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            id="sendRecord"
            v-if="sendRecordVisible"
        >
            <RuleSendRecord :record="curRuleRecord" />
            <div slot="footer" class="dialog-footer">
                <el-button size="mini" @click="sendRecordVisible = false">取 消</el-button>
            </div>
        </yh-dialog>
    </div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
import RiskLeftModule02 from '@/common/components/risk-left-module02.vue';
import RiskRightModule02 from '@/common/components/risk-right-module02.vue';
import RiskIconButton from '@/common/components/risk-icon-button.vue';
import RiskTrantable from '@/common/components/risk-trantable.vue';
import RiskTable from '@/common/components/risk-table.vue';
import { DialogVO } from '@yhfin/biz';
import { checkPermission, dateFormat, getConfigItem, getCurrentPageData, timeFormat } from '@/utils/tools';
import XEUtils from 'xe-utils';
import { getUser } from '@/utils/user-util';
import Invest from '@/common/dict/invest';
import { objToArr, SGU_CACHE } from '@/utils/diction-const-util';
import Index from '@/pages/setting/dict';
import * as moment from 'moment';
import { mixins } from 'vue-class-component';
import RiskEmitter from '@/common/mixis/risk-emitter.vue';
import { ColumnVO, TableConfigVO, VueObject } from '@/common/vo';
import RiskTableP from '@/common/components/risk-table-plus.vue';
import WarningNotice from '../dict/warning-notice';
import API from '../api/warning-notice';
import RuleSendRecord from './rule-send-record.vue';

export interface pages {
    total?: number;
    pageSize?: number;
    currentPage?: number;
    totalPage?: number;
}

@Component({
    name: 'WarningNoticeList',
    components: { RiskLeftModule02, RiskRightModule02, RiskIconButton, RiskTable, RiskTrantable, RiskTableP, RuleSendRecord },
})
export default class WarningNoticeList extends mixins(RiskEmitter) {
    WarningNotice = new WarningNotice();

    private dataSource: any[] = []; // 表格数据
    moduleKey: number = -1;

    private treeData: any = [
        {
            label: '全部选择',
            id: '0',
            children: [
                { label: '风险监控屏', id: '1', auth: checkPermission('B_0397') },
                { label: '静态风控', id: '2', auth: checkPermission('B_0398') },
                { label: '系统运维', id: '4', auth: checkPermission('B_0399') },
                { label: '待办提醒', id: '15', auth: checkPermission('B_0400') },
            ],
        },
    ];

    get showTreeData() {
        let child = this.treeData[0].children.filter(item => item.auth);
        return [{ ...this.treeData[0], children: child }];
    }

    private validSymbolStorage: any = {
        '0': '启用',
        '1': '禁用',
    };

    private currentNodeKey: string = '0'; // 当前选中节点

    private leftHgt: string = '100%';

    private paging: pages = { currentPage: 1, pageSize: 19979797, totalPage: 0, total: 0 };

    private sort: string = '';

    private tableSelection: any[] = []; // 表格勾选数据

    private delCodeList: string[] = []; // 删除数据

    private deleteVisible: boolean = false; // 删除dialog
    private validSymbolVisible: boolean = false; // 静态风控启用/禁用
    private sendRecordVisible: boolean = false; // 单个规则发送记录
    private sendRecordTitle: string = ''; // 单个规则发送记录

    private curRuleRecord: any = {}; // 单个规则发送记录

    private validCodeList: any[] = []; // 启用/禁用勾选数据
    private stateType: string = '0'; // 0启用 1禁用
    private iconDom: any = null; // 图标dom
    private changeIconCols: any[] = [2, 3];
    private noticeTypeStorage: any = {
        '0': '风险监控屏通知',
        '1': '条目监控',
        '2': '上游连接状态',
        '3': '引擎初始化',
        '4': '引擎运行状态',
        '5': 'CDC运行监听',
        '6': '风险报告结果',
        '12': '风险计算异常',
        '9': '条目同步黑白名单启停',
        '10': '条目同步黑白名单更新',
        '13': '分项授信额度',
        '15': '待办提醒通知',
    };

    private ruleId: string = '';
    private ruleName: string = '';
    private noticeGroup: any[] = [];
    private statusGroup: any[] = [];
    private modifyUser: string = '';
    private createUser: string = '';
    private status: string = '';
    private stateEnum: any = {
        '0': '启用',
        '1': '禁用',
    };
    private tableKey: number = 1;
    isExit: boolean = false; // 是否存在黑白名单
    isExit2: boolean = false; // OIS
    isExit3: boolean = false; // 是否存在资管的静态风险处置
    tableConfig: TableConfigVO = {
        rowKey: 'ruleId', // 主键key
        allRowKeys: [], // 所有页数据的key集合
    };
    showColumns: ColumnVO[] = [
        {
            type: 'checkbox',
            selectedAll: false,
            fixed: 'left',
            align: 'center',
            width: 50,
        },
        {
            title: '规则编码',
            field: 'ruleId',
            minWidth: 90,
        },
        {
            title: '规则名称',
            field: 'ruleName',
            minWidth: 120,
        },
        {
            title: '模板类型',
            field: 'noticeType',
            minWidth: 100,
            render: value => this.WarningNotice.noticeTypePojo[value],
        },
        {
            title: '启用状态',
            field: 'status',
            minWidth: 90,
            render: value => this.stateEnum[value],
            style: value => this.getStyle('status', value),
        },
        {
            title: '规则生效开始日',
            field: 'startDate',
            minWidth: 130,
            render: value => dateFormat(value),
        },
        {
            title: '规则生效结束日',
            field: 'endDate',
            minWidth: 130,
            render: value => dateFormat(value),
        },
        {
            title: '通知日历类型',
            field: 'dateType',
            minWidth: 130,
            render: value => this.WarningNotice.dateTypePojo[value],
        },
        {
            title: '发送时间点',
            field: 'startTime',
            minWidth: 110,
            render: value => timeFormat(value, false, 'HH:mm', 'HHmm') || '--',
        },
        {
            title: '执行方式',
            field: 'executionMethod',
            minWidth: 90,
            render: value => this.WarningNotice.executionMethodPojo[value],
        },
        {
            title: '接收角色',
            field: 'notifierName',
            minWidth: 90,
        },
        {
            title: '接收用户',
            field: 'noticeUserName',
            minWidth: 90,
        },
        {
            title: '维护人',
            field: 'modifyUser',
            minWidth: 90,
        },
        {
            title: '维护时间',
            field: 'modifyDate',
            minWidth: 160,
            render: (value, row) => dateFormat(value) + ' ' + timeFormat(row.modifyTime),
        },
        {
            title: '操作',
            field: 'operation',
            minWidth: 170,
            align: 'center',
            fixed: 'right', // 添加
        },
    ];

    created() {
        const isExit3: boolean = getConfigItem('WEB_DOCKING') === 'CMSCHINA';
        this.isExit3 = isExit3;
        if (isExit3) {
            this.treeData[0].children = [{ label: '静态风控处置', id: '6', auth: true }];
            this.currentNodeKey = '6';
        }
        if (sessionStorage.getItem('warnning-notice-treeKey')) {
            this.currentNodeKey = sessionStorage.getItem('warnning-notice-treeKey');
        }
    }

    async mounted() {
        const isExit: boolean = checkPermission('M_206');
        this.isExit = isExit;
        if (isExit) {
            this.treeData[0].children.push({ label: '同步条目黑白名单', id: '3', auth: checkPermission('B_0401') });
        }

        const isExit2: boolean = checkPermission('M_211');
        // const isExit2 = true;
        this.isExit2 = isExit2;
        if (isExit2) {
            this.treeData[0].children.push({ label: '分项授信额度', id: '5', auth: true });
        }

        const isExit3: boolean = getConfigItem('WEB_DOCKING') === 'CMSCHINA';
        this.isExit3 = isExit3;
        if (isExit3) {
            this.treeData[0].children = [{ label: '静态风控处置', id: '6', auth: true }];
            this.currentNodeKey = '6';
        }

        // 根据选中树节点获取预警通知列表
        this.getNoticeList();
        // this.changeTable();
    }

    get calcFilterNoticeType() {
        if (this.currentNodeKey === '1') {
            return [{ label: '风险监控屏通知', value: '0' }];
        } else if (this.currentNodeKey === '2') {
            return [
                { label: '风险报告结果', value: '6' },
                { label: '风险计算异常', value: '12' },
            ];
        } else if (this.currentNodeKey === '3') {
            return [
                { label: '条目同步黑白名单启停', value: '9' },
                { label: '条目同步黑白名单更新', value: '10' },
            ];
        } else if (this.currentNodeKey === '4') {
            return [
                { label: '引擎初始化', value: '3' },
                { label: '引擎运行状态', value: '4' },
            ];
        } else if (this.currentNodeKey === '15') {
            return [{ label: '待办提醒通知', value: '15' }];
        }
        const data = [
            { label: '风险监控屏通知', value: '0', auth: checkPermission('B_0397') },
            { label: '风险报告结果', value: '6', auth: checkPermission('B_0398') },
            { label: '风险计算异常', value: '12', auth: checkPermission('B_0398') },
            { label: '引擎初始化', value: '3', auth: checkPermission('B_0399') },
            { label: '引擎运行状态', value: '4', auth: checkPermission('B_0399') },
            { label: '待办提醒通知', value: '15', auth: checkPermission('B_0400') },
        ];

        if (this.isExit) {
            // M_206 同步条目黑白名单
            data.concat([
                { label: '条目同步黑白名单启停', value: '9', auth: checkPermission('B_0401') },
                { label: '条目同步黑白名单更新', value: '10', auth: checkPermission('B_0401') },
            ]);
        }
        if (this.isExit2) {
            // M_211 分项授信额度
            data.concat([{ label: '分项授信额度通知', value: '13', auth: true }]);
        }

        return data.filter(item => item.auth);
    }

    // 获取树数据 暂时前端写死
    private getTreeData() {}

    private handleRefresh() {
        this.getNoticeList();
    }

    // 获取预警通知列表
    private getNoticeList(refresh: boolean = false) {
        let url = '/notice/monitor/rule/list'; // 暂时写死监控屏 后续应接口出type类型
        let data = {
            paging: this.paging,
            sort: this.sort,
            excludeGroup: ['1', '2', '5'],
            ruleId: this.ruleId,
            ruleName: this.ruleName,
            noticeGroup: this.noticeGroup,
            modifyUser: this.modifyUser,
            createUser: this.createUser,
            status: this.status,
            statusGroup: this.statusGroup,
            // type: this.currentNodeKey
        };
        let obj = {
            '1': ['0'],
            '2': ['6', '12'],
            '3': ['9', '10'],
            '4': ['3', '4'],
            '5': ['13'],
            '6': ['14', '15', '16'],
            '15': ['15'],
        };
        this.$axios({ url, method: 'post', data }).then((res: any) => {
            if (this.currentNodeKey !== '0') {
                res.list = res.list.filter(item => obj[this.currentNodeKey].includes(item.noticeType));
            } else {
                // 点击全部选择时
                if (this.isExit3) {
                    res.list = res.list.filter(item => obj['6'].includes(item.noticeType));
                } else {
                    let keys = [];
                    this.treeData[0].children.map(item => {
                        if (item.auth) {
                            keys.push(item.id);
                        }
                    });
                    let noticeTyeArr = [];
                    keys.map(ele => {
                        noticeTyeArr = noticeTyeArr.concat(obj[ele]);
                    });
                    res.list = res.list.filter(item => noticeTyeArr.includes(item.noticeType));
                }
            }
            this.dataSource = res.list;
            this.changeTable();
            !this.isExit3 &&
                this.dataSource.forEach(element => {
                    element.roleCodes = element.notifier;
                    if (element.startTime) {
                        // 补0
                        element.startTime = this.add0(element.startTime.toString() || '');
                    }
                    if (element.endTime) {
                        // 补0
                        element.endTime = this.add0(element.endTime.toString() || '');
                    }
                });
            this.paging.total = res.list.length;
            this.paging.totalPage = res.totalPage;
            refresh && this.yh_message_success('刷新成功');
        });
    }

    add0(time) {
        if (time.length < 6) {
            const addLen = 6 - time.length;
            for (let i = 0; i < addLen; i++) {
                time = '0' + time;
            }
        }
        return time;
    }

    // 表格勾选事件
    private handleSelectionChange(val): void {
        this.tableSelection = val.selection;
    }

    private currentChange(val): void {
        this.paging.currentPage = val;
        this.getNoticeList();
    }

    // 删除事件
    private handleDelete(val): void {
        if (typeof val === 'string') {
            val = [val];
        } else if (this.isExit3) {
            val = (this.$refs['risk-table'] as VueObject).checkedRows;
        }

        if (!val.length) {
            this.yh_message_warn('请选择删除项！');
            return;
        }
        this.delCodeList = val.map(item => item.ruleId || item);
        this.deleteVisible = true;
    }
    // 静态风控删除事件
    private handleDeleteStatic(val): void {}

    // 提交删除
    private submitDeleteNotice() {
        let url = '/notice/monitor/rule/delete'; // 暂时写死监控屏 后续应接口出type类型
        let data = this.delCodeList;
        this.$axios({ url, method: 'post', data })
            .then((res: any) => {
                this.yh_message_success('删除成功！');
                this.getNoticeList();
                this.deleteVisible = false;
            })
            .finally(() => {
                // 清除导出时列表勾选项
                this.$nextTick(() => {
                    this.isExit3 && (this.$refs['risk-table'] as any).resetCheckRowKeys();
                });
            });
    }
    // 静态风控禁用/启用确认
    private submitValidSymbol() {
        this.$axios({ url: '/notice/monitor/rule/changeStatus', method: 'post', data: { status: this.stateType, ruleIds: this.validCodeList } })
            .then((res: any) => {
                let text = this.stateType === '0' ? '启用成功!' : '禁用成功!';
                this.yh_message_success(text);
                this.getNoticeList();
                this.validSymbolVisible = false;
            })
            .finally(() => {
                // 清除导出时列表勾选项
                this.$nextTick(() => {
                    this.isExit3 && (this.$refs['risk-table'] as any).resetCheckRowKeys();
                });
            });
    }

    private validSymbolBtn(val, type) {
        if (typeof val === 'string') {
            val = [val];
        } else if (this.isExit3) {
            val = (this.$refs['risk-table'] as VueObject).checkedRows;
        }
        if (!val.length) {
            const text = type === '0' ? '启用' : '禁用';
            this.yh_message_warn('请选择' + text + '项！');
            return;
        }
        // 过滤掉type的数据
        val = val.filter(item => item.status != type);
        if (!val.length) {
            const text = type === '0' ? '启用' : '禁用';
            this.yh_message_warn('您勾选的均已' + text + ',请勾选待' + text + '项！');
            return;
        }
        this.validCodeList = val.map(item => item.ruleId || item);
        this.validSymbolVisible = true;
        this.stateType = type;
    }

    // 生成发送待办(资管-静态风险处置)
    sendEmail() {
        let val = (this.$refs['risk-table'] as VueObject).checkedRows;
        if (!val.length) {
            this.yh_message_warn('请选择邮件发送项！');
            return;
        }
        val = val.filter(ele => ele.status == '0');
        if (!val.length) {
            this.yh_message_warn('请选择已启用的邮件发送项！');
            return;
        }
        this.$confirm('是否基于最新计算结果值，生成邮件发送待办?', `确认提示(备注:已自动过滤掉已禁用的规则)`, {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'info',
        }).then(() => {
            let params = val.map(item => {
                return { ruleId: item.ruleId, noticeType: item.noticeType };
            });
            API.sendEmail({ recordEmailRequests: params })
                .then((res: any) => {
                    this.yh_message_success('邮件待办生成成功!');
                    this.getNoticeList();
                })
                .finally(() => {
                    // 清除导出时列表勾选项
                    this.$nextTick(() => {
                        this.isExit3 && (this.$refs['risk-table'] as any).resetCheckRowKeys();
                    });
                });
        });
    }

    // 回调函数
    addTabs(data: any, val: any) {
        let datas: any = {};
        datas.type = data;
        // operateType和scheduleType没有返回  todo
        datas.value = val;
        if (this.isExit3) {
            this.dispatch('WarningNoticeCmschina', 'addTables', datas);
        } else {
            this.dispatch('WarningNotice', 'addTables', datas);
        }
        sessionStorage.setItem('warnning-notice-treeKey', this.currentNodeKey);
    }

    private handleFilterChange({ field, values, datas }): void {
        if (['ruleId', 'ruleName', 'modifyUser', 'createUser'].includes(field)) {
            this[field] = datas.join('');
        } else if (field === 'noticeType') {
            this['noticeGroup'] = values;
        } else if (field === 'status') {
            this['statusGroup'] = values;
        } else {
            this[field] = values;
        }

        this.getNoticeList();
    }

    private handleResizeChange(options: any) {
        this.$nextTick(() => {
            (this.$refs.xTable as any).resetColumn(false);
            // (this.$refs.xTable as any).recalculate(true);
        });
    }
    /*
     * 规则编号：TO_NUMBER(REGEXP_REPLACE(C_RULE_ID,'[^0-9]',''))
     * 规则名称：C_RULE_NAME
     * 更新人：C_MODIFY_USER
     * 更新时间：D_MODIFY_DATE，D_MODIFY_TIME
     * 创建人：C_CREATE_USER
     * 创建时间：D_CREATE_DATE，D_CREATE_TIME
     */
    private handleSelectionChange2(column) {
        let { order, property } = column;

        if (order) {
            order = order.split('ending')[0];
        } else {
            order = '';
        }
        let obj = {
            ruleId: `TO_NUMBER(REGEXP_REPLACE(C_RULE_ID,'[^0-9]',''))`,
            ruleName: 'C_RULE_NAME',
            modifyUser: 'C_MODIFY_USER',
            modifyTime: 'D_MODIFY_DATE,D_MODIFY_TIME',
            createUser: 'C_CREATE_USER',
            createTime: 'D_CREATE_DATE,D_CREATE_TIME',
            noticeType: 'C_NOTICE_TYPE',
            status: 'C_STATUS',
        };

        if (property === 'modifyTime' || property === 'createTime') {
            let arr;
            arr = obj[property].split(',');
            for (let i = 0; i < arr.length; i++) {
                arr[i] = arr[i] + ' ' + order;
            }
            arr = arr.join(',');
            this.sort = arr;
            this.getNoticeList();
            return;
        }
        this.sort = obj[property] + ' ' + order;
        this.getNoticeList();
    }

    // 节点点击事件
    private handleNodeClick(data: any, node: any): void {
        this.currentNodeKey = data.id;

        this.paging = { currentPage: 1, pageSize: 19979797, totalPage: 0, total: 0 };
        this.ruleId = '';
        this.ruleName = '';
        this.noticeGroup = [];
        this.statusGroup = [];
        this.modifyUser = '';
        this.createUser = '';
        this.status = '';
        this.sort = '';
        this.tableKey++;

        // if (data.id == '1') {
        this.iconDom = null;
        this.getNoticeList();
        // }
    }

    // 时间处理
    private dateFormatter(date, time) {
        if (date || time) {
            return (date ? dateFormat(date, true) : '') + ' ' + (time ? timeFormat(time, true) : '');
        }
        return '--';
    }
    private formatterNoticeType(val) {
        return this.noticeTypeStorage[val.noticeType];
    }

    private handleEmailHistory(data: any, val: any): void {
        let datas: any = {};
        datas.type = data;
        datas.value = val;
        if (data == 'history') {
            this.dispatch('WarningNotice', 'addTables', datas);
        } else if (data == 'history-disposal') {
            this.sendRecordVisible = true;
            this.curRuleRecord = val;
            let type = val.executionMethod == '0' ? '自动' : '人工';
            this.sendRecordTitle = type + '-单个规则发送记录';
        }
    }

    private formatterValidSymbol(val) {
        return this.validSymbolStorage[val.validSymbol];
    }

    changeTable() {
        this.$nextTick(() => {
            if (!this.iconDom) {
                this.iconDom = document.querySelectorAll('.vxe-icon--funnel');
                for (let i = 0; i < this.iconDom.length; i++) {
                    if (!this.changeIconCols.includes(i)) {
                        this.iconDom[i].className = 'vxe-filter--btn el-icon-search';
                    }
                }
            }
        });
    }

    private getStyle(val: string, value: string): any {
        let color = '';
        color = value == '0' ? 'green' : value == '1' ? 'red' : '';
        return { color: color };
    }
}
</script>
<style lang="scss" scoped>
.list-left {
    height: 100vh;
    width: 211px;
    border: 1px solid #cacaca;

    .list-heard {
        font-weight: 700;
        font-size: 20px;
        margin: 10px 0px 0px 10px;
    }

    .list-left-div {
        width: 210px;
        height: 40px;
        background: #fff;
        border: 1px solid #cacaca;
        padding-top: 4px;
        padding-left: 10px;
        position: relative;

        .left-p {
            position: absolute;
            right: 5px;
            top: 4px;

            .el-icon-search {
                color: #fff;
            }
        }

        & /deep/ .el-button {
            padding: 6px;
        }
    }

    .left-tree {
        width: 217px;
        height: 50%;
        overflow: scroll;
    }
}
.list-right {
    height: 100%;
    border: 1px solid #cacaca;
    position: absolute;
    top: 0;
    left: 210px;
    width: calc(100% - 210px);

    .list-right-div {
        padding: 0px 10px;
        width: 100%;
        height: 60px;
        line-height: 60px;
    }
}
#editDialog /deep/ .el-dialog {
    margin-top: 3vh !important;
    .el-dialog__body {
        max-height: 90vh;
    }
}
#sendRecord /deep/ .el-dialog .el-dialog__body {
    max-height: 60vh !important;
}

/deep/ .el-dialog .el-dialog__body .el-date-editor {
    min-width: 140px;
    width: 20%;
}

.ascending:hover {
    border-bottom-color: #409eff;
}

.descending:hover {
    border-top-color: #409eff;
}

.icon-minus {
    text-align: center;
    width: 20px;
    height: 20px;
    line-height: 20px;
    border: 1px solid transparent;

    border-radius: 50%;
    margin: 4px 12px;
}

/deep/ .el-select__tags {
    flex-wrap: nowrap;

    .el-tag.el-tag--info {
        display: flex;
        align-items: center;

        .el-select__tags-text {
            display: block;
            max-width: 120px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    }
}
.temp {
    // pointer-events: none;
    cursor: no-drop;
}

/deep/ td {
    border: initial;
}
/deep/ .vxe-table--render-default .vxe-table--fixed-right-wrapper {
    box-shadow: -1px 0px 1px rgba(0, 0, 0, 0.12) !important;
}
</style>
